<template>
    <!-- 单选题 -->
    <div class="singleproblem">
        <div class="porblem-title">
            <Mtitle :title="title" :top="18" :bottom="10" />
            <!-- 选项 -->
            <div>
                <van-radio-group v-model="models.radios">
                    <van-radio v-for="(item, index) in option" :key="index" :name="item" @click="check_options(item, item.questionItemIntro)"> {{ item.questionItemTitle }} </van-radio>
                </van-radio-group>
            </div>
        </div>
    </div>
</template>
<script>
import { Radio, Toast } from 'vant'
import Mtitle from '@/components/global_title.vue' 
import { eventBus} from '@/components/eventBus'
export default {
    components: {
        Radio,
        Toast,
        Mtitle
    },
    props: {
        // 题目详情
        details: {
            type: Object,
            default: () => {}
        },
        indexId: {
            type: Number,
            default: 0
        }
    },
    data() {
        return {
            attach: this.details.questionItemId,
            answer_id: this.details.questionId,
            title: this.details.questionTitle, // 标题
            option: this.details.questionItem, // 选项
            Intro: '',
            models: {
                radios: '0'
            },
            ok: false
        }
    },
    methods: {
        // 选题
        check_options(option, Intro) {
            console.log(this.indexId + 1)
            if (option.subordinateId != null) {
                console.log('新增题', option)
                eventBus.$emit('addQuestion', {data: option.question, indexId: Number(this.indexId + 1)})
            }
        }
    }
}
</script>
<style scoped lang="scss">
::v-deep.van-radio-group {
    display: flex;
    flex-wrap: wrap;
}
::v-deep.van-radio-group .van-radio {
    margin-right: 20px;
    margin-left: 10px;
    margin-bottom: 15px;
}
::v-deep.van-radio-group .van-radio__label {
    font-size: 14px !important;
    font-weight: 500;
    color: #172b4d;
}
::v-deep.van-field {
    width: 50%;
}
.agree_van-radio ::v-deep .van-radio-group {
    display: flex !important;
    flex-wrap: nowrap !important;
    >p {
        font-size: 14px;
        margin-left: -20px;
        color: #40ba9b;
        font-weight: 500;
    }
}
.hint_wrap {
    >p:nth-child(1) {
        font-size: 14px;
        font-weight: 500;
        margin: 10px 0;
    }
    >p:nth-child(2) {
        font-size: 14px;
    }
}
</style>
